<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--    <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link type="image/x-icon" rel="shortcut icon" href="css/favicon.ico">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Marlin configurator</title>
    <!-- Bootstrap -->
    <link href="libs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
    <script src="libs/jquery/dist/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="libs/tether/dist/js/tether.min.js"></script>
    <script src="libs/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="libs/socket.io-client/dist/socket.io.js"></script>
    <script src="js/jquery.ba-throttle-debounce.js"></script>
<!--<script src="libs/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>-->
    <script src="git/bootstrap-treeview/bootstrap-treeview.min.js"></script>
    <link  href="libs/cropper/dist/cropper.css" rel="stylesheet">
    <script src="libs/cropper/dist/cropper.js"></script>
    <link href="css/toggle.css" rel="stylesheet">
    <link href="libs/font-awesome/css/font-awesome.css" rel="stylesheet"> <!-- rework to svg-->
    <link href="css/spinner.css" rel="stylesheet">
    <link href="css/input-expand-group.css" rel="stylesheet">
<script src="/version/Home"></script>
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="main.js"></script>
    <script src="snippets.js"></script>
<style>
/* layout.css Style */
.upload-drop-zone {
  height: 200px;
  border-width: 2px;
  margin-bottom: 20px;
}

/* skin.css Style*/
.upload-drop-zone {
  color: #ccc;
  border-style: dashed;
  border-color: #ccc;
  background:rgba(255,255,255,.8);
  line-height: 200px;
  text-align: center
}
.upload-drop-zone.drop {
  color: #222;
  border-color: #222;
}
.mct-hint{
  position: fixed;
  overflow-y:auto;
  background: white;
  top: 70%;
  height: 30%;
  z-index: 5;
}
@media (min-width: 992px){
.mct-hint{
  right: 0;
  height:90vh;
  top:initial;
}
}
.large.tooltip-inner {
    max-width: 350px;
    width: 350px;
}
.navbar-side-right:before{
    content: "";
    position: absolute;
    width: 83px;
    height: 25px;
    top: 50%;
    left: -54px;
    z-index: -1;
    background: url(css/text-25.png) 0 0 no-repeat;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.navbar-side-right{
    position: fixed;
    z-index: 1030;
    transition: right 1s;
    right:-200px;
    max-width: 200px;
}
.navbar-side-right.toggled,
.navbar-side-right:hover{
    right:0;
}

.form-group.disabled{
  opacity:.5;
}
.form-group {
    margin-bottom: .5rem;
}
#mct-examples-modal .modal-body {
    max-height: 500px;
    overflow-y: auto;
}
#mct-tags-modal .modal-body {
    max-height: 500px;
    overflow-y: auto;
}
.mct-hint iframe {
    width: 100%;
    height: 100%;
    border: none;
    margin-bottom: -10px;
}
</style>
<script>
  //open links externally by default
window.opener = window.open;
if (typeof require === 'function') { //commonJS from electron
  var shell = require('electron').shell;
  window.opener = shell.openExternal;
  $(document).on('click', 'a[href^="http"]', function(event) {
      event.preventDefault();
      shell.openExternal(this.href);
  });
}
$(function() {
  if (typeof require === 'function') { //commonJS from electron
    var ipc = require('electron').ipcRenderer;
    function found(val) {
      $('.mct-search').focus().parent().removeClass('expanded').find('span').text(val);
    }
    $('.mct-search').on('change', function() {
      $(this).parent().addClass('expanded');
      ipc.send('search-text', $(this).val());
      !$(this).val().length && found(0)
    })
    ipc.on('search-found', function(ev, arg) {
      found(arg);
    })
  } else {
    $('.mct-search').parent().hide();
  }
})
</script>
  </head>
  <body lang="en">
<div class="container-fluid">
  <!-- Modal -->
        <div class="modal fade" id="mct-console-modal" tabindex="-1" role="dialog" aria-labelledby="consoleModalLabel" aria-hidden="true" >
          <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="consoleModalLabel">Serial console</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
<div class="form-group">
  <textarea class="form-control" rows="30"></textarea>
</div>
<div class="form-group">
    <div class="input-group">
      <span class="input-group-addon">
        <input type="checkbox" aria-label="Checkbox for following text input" checked>
      </span>
      <input type="text" class="form-control" placeholder="Send it...">
      <span class="input-group-btn">
        <button class="btn btn-secondary" type="button">Send!</button>
      </span>
    </div>
</div>
              </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-tags-modal" tabindex="-1" role="dialog" aria-labelledby="tagsModalLabel" aria-hidden="true" >
          <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="tagsModalLabel">Available releases</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                <table class="table table-hover table-sm">
                  <thead>
                    <tr>
                      <th>Date<th>Version
                  <tbody>
                </table>
              </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Change</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-qr-modal" tabindex="-1" role="dialog" aria-labelledby="qrModalLabel" aria-hidden="true" >
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="qrModalLabel">Scan this QRcode to open url</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                <img style="width:100%"></img>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-log-modal" tabindex="-1" role="dialog" aria-labelledby="logModalLabel" aria-hidden="true" >
          <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="logModalLabel">Information about changes</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                <p></p>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-examples-modal" tabindex="-1" role="dialog" aria-labelledby="examplesModalLabel" aria-hidden="true" >
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="examplesModalLabel">Available examples</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                <p>Current is:<br><b><span></sapn></b></p>
                <p>to apply files do `RESET` command after configuration selection</p>
                <table class="table table-hover table-sm">
                  <thead>
                    <tr>
                      <th>Name
                  <tbody>
                </table>
              </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">Change</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-reset-modal" role="dialog" aria-labelledby="resetModalLabel" aria-hidden="true">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="resetModalLabel">Changed files</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>

              <div class="modal-body">
                <p></p>
              </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-danger">Reset</button>
              </div>
            </div>
          </div>
        </div>
        <div class="modal fade" id="mct-pio-modal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div class="modal-dialog" style="max-width:initial;width: 75vw;">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">Log</h4>
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                  </button>
              </div>
              <div class="modal-body">
                <div class="form-group">
                  <pre style="height: 60vh;overflow:auto;background-color: black;color: white;">
                  </pre>
                </div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
              </div>
            </div>
          </div>
        </div>
<div class="modal fade" id="mct-publishModal" tabindex="-1" role="dialog" aria-labelledby="mct-publishModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="mct-publishModalLabel">Type some description</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form>
          <div class="form-group">
            <label for="message-text" class="form-control-label">Version:</label>
            <input class="form-control" name="version" disabled>
          </div>
          <div class="form-group">
            <label for="message-text" class="form-control-label">Author:</label>
            <input class="form-control" name="author">
          </div>
          <div class="form-group">
            <label for="message-text" class="form-control-label">Message:</label>
            <textarea class="form-control" rows="8" name="description"></textarea>
          </div>
          <input name="session" type="hidden">
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Publicate</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="mct-promptModal" tabindex="-1" role="dialog" aria-labelledby="mct-promptModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="mct-promptModalLabel">Type some description</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form>
          <div class="form-group">
            <label for="message-text" class="form-control-label">Message:</label>
            <textarea class="form-control" rows="8" id="message-text"></textarea>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="mct-restoreModal" tabindex="-1" role="dialog" aria-labelledby="mct-restoreModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="mct-restoreModalLabel">Choose desired configuration from storage</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p style="max-height:50vh;overflow-y:auto;"></p>
          <div class="form-group">
            <label for="message-text" class="form-control-label">Message:</label>
            <textarea class="form-control" rows="8" id="message-text" disabled></textarea>
          </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary mct-download">Download</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Upload</button>
      </div>
    </div>
  </div>
</div>

<!-- toolbar -->
<div class="fixed-top">
<nav class="navbar navbar-toggleable-md navbar-light bg-faded">
  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <a class="navbar-brand" target="_blank" href="https://github.com/MarlinFirmware/Marlin">Marlin</a>
  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <div class="navbar-nav mr-auto">
      <div class="form-inline">
      <div class="dropdown d-inline-block mr-2">
        <button class="btn btn-info dropdown-toggle mct-tag" title="Current release" id="dropdownTagsLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          TAGS
        </button>
        <div class="dropdown-menu" aria-labelledby="dropdownTagsLink">
          <button class="dropdown-item mct-tags" title="Change version (Releases)" ><i class="fa fa-tag"></i> Change</button>
          <button class="dropdown-item mct-branches" title="Change version (Development verions - these can be unstable!!!)" ><i class="fa fa-code-fork"></i> Branches</button>
          <button class="dropdown-item mct-update" title="Update version list from GitHub (git fetch)"><i class="fa fa-refresh"></i> Update</button>
          <button class="dropdown-item bg-danger text-white mct-reset" title="Reset all changes (git checkout -f) or copy from examples if choosen"><i class="fa fa-trash"></i> Reset</button>
          <button class="dropdown-item mct-examples" title="Choose base file from examples"><i class="fa fa-archive"></i> Examples</button>
          <button class="dropdown-item mct-save" data-toggle="modal" data-target="#mct-promptModal" title="Place current configuration in the safe place"><i class="fa fa-floppy-o"></i> Save</button>
          <a href="zip/TWFybGlu" class="dropdown-item" title="Get zipped configuration files" ><i class="fa fa-file-archive-o"></i> Download</a>
          <button class="dropdown-item mct-publish" title="Publish your configuration files" ><i class="fa fa-share"></i> Publish</button>
          <div class="dropdown-divider"></div>
          <button class="dropdown-item bg-warning mct-issue" title="Create an issue on Marlin Firmware GitHub repository" ><i class="fa fa-bug"></i> Firmware Issue</button>
        </div>
      </div>
      <button type="button" class="btn btn-warning mct-info mr-2" title="Show information"><i class="fa fa-info"></i><span class="badge badge-danger ml-2" hidden>0</span></button>
      <div class="input-expand-group mr-2" >
        <input class="form-control input-lg mct-search" placeholder="Searchin text" type="text">
        <div> <i class=" fa fa-search"></i></div>
        <div><div>found <span>0</span></div></div>
      </div>
<div class="onoffswitch mct-changed mr-2"  title="Toggle only changed options">
    <label>
        <input type="checkbox" class="onoffswitch-checkbox">
        <span class="onoffswitch-inner" data-content-on="Changed" data-content-off="All"></span>
        <span class="onoffswitch-switch"></span>
    </label>
</div>
        <div class="dropdown d-inline-block mr-2">
          <button class="btn btn-warning dropdown-toggle" id="dropdownUploadLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="update current configuration from files or store">Upload</button>
          <div class="dropdown-menu" aria-labelledby="dropdownUploadLink">
            <button class="dropdown-item bg-warning mct-upload" title="Upload your old configuration or drag it in browser"><i class="fa fa-file"></i> Files</button>
            <button class="dropdown-item mct-restore" title="Get files from storage"><i class="fa fa-heart"></i> Saved</button>
            <button class="dropdown-item mct-published" title="Get published files from site"><i class="fa fa-globe"></i> Published</button>
          </div>
        </div>
          <input type="file" name="files[]" class="mct-upload" multiple style="display:none;">
<div class="btn-group mr-2">
  <button type="button" class="btn btn-secondary mct-pio-compile disabled" title="Compile Marlin with PlatformIO"><i class="fa fa-code"></i> Compile</button>
  <button type="button" class="btn btn-secondary dropdown-toggle dropdown-toggle-split" title="Select enviroment for compilation" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu mct-pio-env">
    <a class="dropdown-item bg-info" href="#">Default</a>
    <div class="dropdown-divider"></div>
  </div>
</div>

<div class="btn-group mr-2">
  <button type="button" class="btn btn-secondary mct-pio-flash disabled" title="Upload firmware with PlatformIO to selected port"><i class="fa fa-upload"></i> Flash</button>
  <button type="button" class="btn btn-secondary mct-pio-ports dropdown-toggle dropdown-toggle-split" title="Select port for your PlatformIO device" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <div class="dropdown-menu mct-ports">
    <a class="dropdown-item bg-info" href="#">Default</a>
    <div class="dropdown-divider"></div>
  </div>
</div>
      <div class="dropdown d-inline-block mr-2">
        <button class="btn btn-info dropdown-toggle mct-tag" title="Current release" id="dropdownTagsLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Tools
        </button>
        <div class="dropdown-menu" aria-labelledby="dropdownTagsLink">
        <button type="button" class="dropdown-item mct-consoles mr-2" title="Manager of serial consoles"><i class="fa fa-terminal"></i> Consoles</button>
        <button type="button" class="dropdown-item mct-editor mr-2" title="Online instant collaboration editor"><i class="fa fa-edit"></i> Editor</button>
        </div>
      </div>

    </div>
    </div>
    <div class="text-right">
    <a target="_blank" href="https://github.com/akaJes/marlin-config"><img src="/version" title="current version" height="18"></a><br>
    <a target="_blank" href="https://www.npmjs.com/package/marlin-conf"><img src="https://badge.fury.io/js/marlin-conf.svg" alt="npm version" height="18"></a><br>
    </div>
  </div>
</nav>
<nav class="navbar navbar-toggleable-md navbar-light bg-faded config-files">
        <ul class="nav nav-tabs" role="tablist">
          <template class="_tab_item">
          <li class="nav-item">
            <a href="#" class="nav-link" role="tab" data-toggle="tab"></a>
          </li>
          </template>
        </ul>
</nav>
  <div class="upload-drop-zone" id="mct-dragzone" style="display:none">
      Just drag and drop files here
  </div>
  <div id="mct-alert" >
    <template class="_alert">
    <div class="alert alert-danger alert-dismissible fade show" role="alert" data-dismiss="alert" >
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <h4 class="alert-heading">Oh snap!</h4>
      <p></p>
    </div>
    </template>
    <template class="_info">
    <div class="alert alert-info alert-dismissible fade show" role="alert" data-dismiss="alert" >
      <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
      </button>
      <h4 class="alert-heading">Information</h4>
      <p></p>
    </div>
    </template>
  </div>
  <div class="progress mct-progress" style="display:none">
    <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
      <span class=""></span>
    </div>
  </div>
</div>
<div class="navbar-side-right">
<nav id="navbar-sections" class="navbar navbar-light bg-faded">
  <ul class="nav nav-tabs flex-column" role="tablist">
    <template class="_nav_item">
      <li class="nav-item">
        <a href="#" class="nav-link" role="tab" data-toggle="tab"></a>
      </li>
    </template>
  </ul>
  <div class="tab-content">
    <template class="_nav_content">
      <ul class="tab-pane nav nav-pills flex-column">
        <template class="_nav">
          <li class="nav-item"><a class="nav-link py-0 pl-0" href="#"></a></li>
        </template>
      </ul>
    </template>
  </ul>
</nav>
</div>
<!-- content -->
  <div class="row" style="margin-bottom: 300px;margin-top:150px;">
    <div class="col-12 col-md-12 col-lg-7">
      <div class="tabbable">
        <div class="tab-content">
          <template class="_tab_content">
          <div class="tab-pane fade" id="panel-ID" role="tabpanel">
              <template class="_section">
              <div class="card">
                <div class="card-header h5">
                    <label class="form-control-label col-sm-2 col-4 text-right" ><i class="fa fa-folder"></i></label><strong><span></span></strong>
                    <button type="button" class="btn btn btn-sm float-right" title="show all">All <span class="badge badge-default"></span></button>
                    <span class="float-right">&nbsp;</span>
                    <button type="button" class="btn btn-info btn-sm float-right" title="show only changed">Changed <span class="badge badge-default"></span></button>
                </div>
                <div class="card-block">
                  <div class="form-horizontal" role="form">
                  <template class="_define">
                    <div class="form-group row">
                      <label class="col-sm-5 col-5 col-form-label col-form-label-sm my-auto"></label>

                      <div class="col-sm-6 col-6 my-auto">
<div class="onoffswitch">
    <label>
        <input type="checkbox" class="onoffswitch-checkbox">
        <span class="onoffswitch-inner" data-content-on="On" data-content-off="Off"></span>
        <span class="onoffswitch-switch"></span>
    </label>
</div>
                        <div class="mb-1 mct-splitter"></div>
<div class="input-group">
                        <input type="text" class="form-control form-control-sm">
  <div class="input-group-btn">
<button class="btn btn-secondary btn-sm" type="button"><i class="fa fa-times"></i></button>
  </div>
</div>
  <select class="custom-select   form-control-sm">
    <option value="true">True</option>
    <option value="false">False</option>
  </select>
                      </div>
                      <div class="col-sm-1 col-1 my-auto btn-group px-0">
                        <button type="button" class="btn btn-warning btn-sm fa fa-info" title="Show explanation"></button>
                        <button type="button" class="btn btn-secondary btn-sm fa fa-github" title="Github issues"></button>
                      </div>
                    </div>
                  </template>
                  </div>
                </div>
              </div>
              </template>
              <template class="_group">
              <div class="card">
                <div class="card-header h5">
                    <label class="form-control-label col-sm-2 text-right" >Group:</label><strong><span></span></strong>
                </div>
                <div class="card-block">
                  <div class="form-horizontal" role="form">
                  <template class="_gcode">
                    <div class="form-group row">
                      <label class="col-sm-4 col-form-label my-auto" data-toggle="tooltip" data-animation="false"></label>
                      <div class="col-sm-5 my-auto" data-toggle="tooltip"  data-animation="false">
                      </div>
                      <div class="col-sm-2 my-auto" data-toggle="tooltip"  data-animation="false">
                      </div>
                      <div class="col-sm-1 my-auto">
                        <button type="button" class="btn btn-warning btn-sm fa fa-info" title="Show explanation"></button>
                      </div>
                    </div>
                  </template>
                  </div>
                </div>
              </div>
              </template>
              <template class="_snippet">
              <div class="card">
                <div class="card-header h5">
                    <label class="form-control-label offset-md-1"><strong><span></span></strong></label>
                </div>
                <div class="card-block">
                  <div class="form-horizontal" role="form">
                  </div>
                </div>
              </div>
              </template>
          </div>
          </template>
        </div>
      </div>
    </div>
    <div class="col-lg-5 mct-hint">
      <iframe></iframe>
    </div>
  </div>
</div>
  </body>
</html>